<template>
  <div class="main" ref="remove">
    <div class="univDetailWrap" ref="btnImg">
      <div v-show="syStyle && showBannerImg" class="abcdImg">
        <img style="border: none;" class="unviBg" :src="academyData.image" alt="" />
        <span v-show="hasBack" class="backTs" @click="goback">
          <i class="imgIcon"></i>
        </span>
      </div>
      <!-- <goBack></goBack>	 -->
      <!-- <div class="back" v-show="syStyle === false || showBannerImg === false">
        <div :class="['shadow-back', !syStyle ? 'whites' : '']">
          <div class="backboxs" @click="goback" v-if="hasBack">
            <i class="imgIcon"></i>
            <span class="back">返回</span>
          </div>
          <div class="backboxs" v-if="!hasBack && !syStyle">
            <span class="back">{{ schoolName }}</span>
          </div>
        </div>
      </div> -->
      <scroller ref="scrollerBottom" style="top: 46px;" :on-infinite="infinite">
        <div>
          <div class="univDetail">
            <div ref="boxHeight">
              <div v-show="showBannerImg" style="width:100%;height: 1.8rem;opacity: 0;"></div>
              <div class="topWrap" style="position: relative;">
                <div :class="['univBar', collsMuen ? 'univCollHei' : '']">
                  <div class="univTopBar flex-h" style="align-items:initial">
                    <div class="left">
                      <img :src="academyData.icon" alt="" />
                    </div>
                    <div class="right flex1">
                      <span class="sp1" style="font-size: 0.34rem;">{{ academyData.name }}</span>
                      <span class="sp2">{{ academyData.feature }}</span>
                    </div>
                    <!-- <span v-if="false" @click="follow(academyData)" :class="['sp0', academyData.followStatus ? 'sp3' : 'sp4']">{{ academyData.followStatus === 1 ? '+关注' : '已关注' }}</!-->
                  </div>
                </div>
              </div>
            </div>
            <div class="issueBox">
              <div class="issueList" v-for="(item, index) of issueList" :key="index">
                <div class="flex-h times" v-if="item.answer">
                  <b>回答了问题</b> <b class="flex1 right">{{ item.answer_at }}</b>
                </div>
                <h2>{{ item.text }}</h2>
                <div class="replyBox" v-if="item.answer">
                  <span v-show="false"><img src="~@/static/images/zan.png" alt="" /><b>87</b></span>
                  <p>{{ item.answer }}</p>
                </div>
              </div>
            </div>
          </div>
          <div style="width: 100%;height: 46px;"></div>
        </div>
      </scroller>
    </div>
    <div v-show="showComment" class="fixbtn" @click="goPutIssue">提问</div>
  </div>
</template>
<script>
import { followUser } from '~/api/colleges'
import ls from 'store2'
import { getQuestions } from '~/api/school'
import { backAppOrWx } from '~/common/common'
export default {
  components: {},
  data() {
    return {
        showComment:true,
      academyData: {},
      issueList: [],
      hasBack: true,
      showBannerImg: true,
      univData: [],
      syStyle: true, //滑动时的效果,使用v-bind:style="deleteSlider"
      collsMuen: true,
      currentPage: 1
    }
  },
  methods: {
    goPutIssue() {
      if (!ls.get('tokensyxk') || !ls.get('userVoId')) {
        //没有登陆信息或者没有uservoid 或者usertype
        let keysPath = {
          category: 'home',
          paths: process.env.mallurl + '?from=wechat'
        }
        sessionStorage.setItem('goesRouter', JSON.stringify(keysPath))
        this.commonJs.gopush('../login/msgLogin')
        return false
      }
      this.commonJs.gopush('putIssue', this.$route.query.type)
    },
    infinite(done) {
      if (this.currentPage < this.totalPages) {
        this.currentPage = this.currentPage + 1
        getQuestions(this.$route.query.type, this.currentPage, 10).then(res => {
          let newArr = res.questions.data
          this.issueList = this.issueList.concat(newArr)
          this.totalPages = Math.ceil(res.questions.meta.total / 10)
          done()
        })
      } else {
        done(true)
        return
      }
    },
    getQuestions() {
      this.$loading('open')
      getQuestions(this.$route.query.type, 1, 10)
        .then(res => {
          this.academyData = res.academy
          this.issueList = res.questions.data
          this.totalPages = Math.ceil(res.questions.meta.total / 10)
        })
        .finally(() => {
          this.$hideLoading()
        })
    },
    goback() {
      backAppOrWx()
    }
    // follow(datas) {
    //   followUser({
    //     academyCode: this.academyCode,
    //     action: datas.followStatus,
    //     fromUserId: ls.get('yxkData').userId
    //   })
    //     .then(res => {
    //       if (res.code === '0') {
    //         datas.followStatus === 1 ? (datas.followStatus = 0) : (datas.followStatus = 1)
    //         let obj = {
    //           type: this.univData.followStatus + '',
    //           academyCode: this.academyCode
    //         }
    //         if (this.commonJs.checkTerminal() == 'ios') {
    //           window.webkit.messageHandlers.getFollowMsg.postMessage(obj)
    //         } else if (this.commonJs.checkTerminal() == 'android') {
    //           obj = JSON.stringify(obj)
    //           ZMParentsJsToAndroid.getFollowMsg(obj)
    //         } else {
    //           let $index = this.$store.state.followIndex
    //           let sersData = JSON.parse(sessionStorage.getItem('serListData'))
    //           let obData = JSON.parse(sessionStorage.getItem('yxkListData'))
    //           obData.forEach(item => {
    //             if (item.academyCode == this.academyCode) {
    //               item.followStatus = datas.followStatus
    //             }
    //           })
    //           if (sersData) {
    //             sersData.forEach(item => {
    //               if (item.academyCode == this.academyCode) {
    //                 item.followStatus = datas.followStatus
    //               }
    //             })
    //           }
    //           setTimeout(() => {
    //             if (sersData) {
    //               sessionStorage.setItem('serListData', JSON.stringify(sersData))
    //             }
    //             sessionStorage.setItem('yxkListData', JSON.stringify(obData))
    //           }, 20)
    //         }
    //       }
    //       this.$vux.toast.text(res.message)
    //     })
    //     .catch(error => {})
    // },
  },
  mounted: function() {
    this.$visit('Academy/' + this.commonJs.GetUrlParam('academyCode'))
    if(sessionStorage.getItem('fromplat') || this.$route.query.mini_token){ 
        this.showComment = false
     }
    this.getQuestions()
  }
}
</script>
<style scoped lang="less">
.shadow-back {
  width: 100%;
  height: 0.8rem;
  line-height: 0.8rem;
  padding: 0.2rem 0.3rem;
  box-sizing: border-box;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  .backboxs {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    width: 6.9rem;
    height: 0.8rem;
    padding: 0.2rem 0;
  }
  .imgIcon {
    width: 0.4rem;
    height: 0.4rem;
    vertical-align: middle;
    display: inline-block;
    background: url('~@/static/sprite/icon_sprites_40.png') -0.1rem -0.1rem;
    background-size: 3rem 2.4rem;
  }
  .back {
    display: inline-block;
    margin-left: 0.1rem;
    font-weight: bold;
    color: #222;
    vertical-align: middle;
    width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
}
.whites {
  background: #fff;
}
.univDetailWrap {
  width: 7.5rem;
  min-height: 100vh;
  height: auto;
  background: #fff;
  .abcdImg {
    width: 100%;
    height: 3.8rem;
    border: none;
    .unviBg {
      width: 100%;
      height: 3.8rem;
      display: block;
      background: url('~/static/header.png') no-repeat;
      background-size: 100% 100%;
    }
    .backTs {
      position: absolute;
      display: block;
      width: 0.5rem;
      height: 0.5rem;
      background: rgba(0, 0, 0, 0.5);
      border-radius: 50%;
      left: 0.3rem;
      top: 0.2rem;
      text-align: center;
      line-height: 0.5rem;
      .imgIcon {
        display: block;
        margin: 0.05rem auto;
        width: 0.4rem;
        height: 0.4rem;
        background: url('~@/static/sprite/icon_sprites_40.png') -0.7rem -0.1rem;
        background-size: 3rem 2.4rem;
      }
    }
  }
  .back {
    width: 100%;
  }
  .univDetail {
    width: 100%;
    height: auto;
    .topWrap {
      width: 100%;
      height: auto;
      padding: 0 0.3rem 0.4rem;
      box-sizing: border-box;
      .univBar {
        width: 6.9rem;
        height: auto;
        background: rgba(255, 255, 255, 1);
        box-shadow: 0px 0px 20px 0px rgba(204, 204, 204, 0.3);
        border-radius: 0.2rem;
        overflow: hidden;
        transition: all 0.35s;
        .univTopBar {
          width: 6.9rem;
          height: auto;
          padding: 0 0.3rem 0.2rem;
          box-sizing: border-box;
          position: relative;
          .left {
            width: 1.5rem;
            height: 2.24rem;
            img {
              display: block;
              width: 1.2rem;
              height: 1.2rem;
              margin-top: 0.5rem;
              border-radius: 50%;
              border: none;
              background: url('~/static/iconheader.png') no-repeat;
              background-size: 100%;
            }
          }
          .right {
            height: auto;
            .sp1 {
              width: 3.7rem;
              display: block;
              height: auto;
              margin-top: 0.4rem;
              font-family: 'PingFang-SC-Bold';
              font-weight: bold;
              color: rgba(34, 34, 34, 1);
            }
            .sp2 {
              display: block;
              font-size: 0.26rem;
              font-family: 'PingFang-SC-Bold';
              font-weight: bold;
              color: rgba(153, 153, 153, 1);
              line-height: 0.4rem;
              margin-top: 0.2rem;
            }
          }
          .sp0 {
            position: absolute;
            right: 0.3rem;
            top: 0.3rem;
            width: 1.1rem;
            height: 0.5rem;
            border-radius: 0.25rem;
            font-size: 0.26rem;
            font-family: 'PingFang-SC-Bold';
            font-weight: bold;
            line-height: 0.46rem;
            text-align: center;
          }
          .sp3 {
            color: @mainColor;
            border: 0.02rem solid @mainColor;
            box-sizing: border-box;
          }
          .sp4 {
            background: #fafafa;
            color: #bbbbbb;
          }
        }
      }
      .univCollHei {
        height: auto;
      }
    }
  }
}
.issueBox {
  width: 100%;
  height: auto;
  padding: 0 0.3rem;
  box-shadow: border-box;
  background: #fff;
  .issueList {
    padding: 0.4rem 0;
    border-bottom: 0.01rem solid rgba(229, 232, 237, 1);
    .times {
      margin-bottom: 0.1rem;
      b {
        font-size: 0.26rem;
        font-weight: 400;
        color: rgba(153, 153, 153, 1);
      }
      .right {
        text-align: right;
      }
    }
    h2 {
      height: auto;
      display: block;
      font-size: 0.3rem;
      font-weight: 600;
      color: rgba(34, 34, 34, 1);
      margin-bottom: 0.2rem;
    }
    .replyBox {
      width: 100%;
      height: auto;
      background: #f7f7fa;
      border-radius: 0.06rem;
      padding: 0.3rem;
      box-sizing: border-box;
      span {
        display: block;
        text-align: right;
        img,
        b {
          vertical-align: middle;
        }
        img {
          width: 0.32rem;
          height: 0.32rem;
        }
        b {
          font-size: 0.24rem;
          font-weight: 400;
          color: rgba(199, 199, 199, 1);
          margin-left: 0.1rem;
        }
      }
      p {
        font-size: 0.26rem;
        font-weight: 400;
        color: rgba(153, 153, 153, 1);
        line-height: 0.4rem;
      }
    }
  }
}
.fixbtn {
  width: 3rem;
  height: 0.9rem;
  background: rgba(255, 173, 13, 1);
  box-shadow: 0px 0.08rem 20px 0px rgba(255, 173, 13, 0.3);
  border-radius: 0.45rem;
  text-align: center;
  line-height: 0.9rem;
  position: fixed;
  bottom: 0.3rem;
  left: 50%;
  margin-left: -1.5rem;
  font-size: 0.3rem;
  font-weight: 600;
  color: rgba(255, 255, 255, 1);
}
</style>
